<template>
       <div>
           <el-dialog  :title="title" :fullscreen="dialogFull" v-model="showSysMenuBtn" width="75%" >
               <ElementTable ref="pageTable"
                             :pageColumns="pageColumns"
                             :optBtn="optBtn"
                             :formObject="formObj"
                             :btnList="btnList"
                             :optWidth=230
                             :url="url"
                             :loading="loading"
                             @optClick="optClick"
                             @btnListClick="btnListClick">

               </ElementTable>

           </el-dialog>
       </div>

    <SysMenuBtnEdit ref="refSysMenuBtnEdit" @page="_page"></SysMenuBtnEdit>

</template>

<script>


    import ElementTable from '../../../components/base/ElementTable'
    import SysMenuBtnEdit from './SysMenuBtnEdit'
    export default {
        name: "SysMenuEdit",
        components:{
            ElementTable,
            SysMenuBtnEdit
        },
        mounted() {

        },
        data(){
            return{
                labelPosition:'right',
                loading:true,
                id:undefined,
                url:'/api/sys_resource/page_vo_btn',
                formObj:{
                    name:undefined,
                    parentName:undefined,
                    code:undefined,
                    url:undefined,
                    pic:undefined,
                    remark:undefined,
                    orderBy:undefined,
                    type:1,
                    pid:undefined
                },
                pageColumns:[
                    {key:'name',title:'按钮名称',width:150},
                    {key:'code',title:'按钮ID',width:260},
                    {key:'parentName',title:'上级菜单',width:260},
                    {key:'status',title:'状态',width:160,yesNo:true}
                ],
                optBtn:[
                    {icon:'el-icon-edit',name:'编辑',id:''}
                ],
                btnList:[
                    {icon:'el-icon-plus',type:'primary',name:'新增按钮',id:''}
                ],
                pNameList:[],
                parentName: undefined,
                showSysMenuBtn:false,
                title:'',
                dialogFull:false,
                formLabelWidth: '150px',
                rules: {
                    name: [
                        { required: true, message: '请输菜单名称', trigger: 'blur' }
                    ],
                    url: [
                        { required: true, message: '请输菜单URL', trigger: 'blur' }
                    ],
                    code: [
                        { required: true, message: '请输菜单编码', trigger: 'blur' }
                    ]
                }
            }
        },
        methods:{
            optClick(data){
                switch (data.name) {
                    case '编辑':
                        break
                    case '新增按钮':
                        this.addNewBtn()
                        break
                    case 'selectData':
                        let ids = []
                        if (data.obj.length==0){
                            this.selectIds=[]
                        }else {
                            data.obj.forEach(function (item,value) {
                                ids[value]=item.id
                            })
                        }
                        this.selectIds = ids
                        break
                }
            },

            open(data){
                console.log('data---',data.name)
                this.title=data.name+'---按钮'
                this.showSysMenuBtn = true
                this.id = data.id
                this.formObj.pid = data.id
                this._page()
            },
            addNewBtn(){
                this.$refs.refSysMenuBtnEdit.open(this.id)
            },

            btnListClick(name){
                switch (name) {
                    case '新增按钮':
                        this.addNewBtn()
                        break
                }
            },


            _page(){
                this.$refs.pageTable.page()
            }
        }
    }
</script>

<style scoped>

</style>